<template>
	<view class="home">
		  <view class="container">
		    <!-- Logo区域 -->
		    <view class="logo-container">
		      <image class="logo" src="/static/logo.png" mode="aspectFit"></image>
		      <text class="app-name">测流量水</text>
		    </view>
		    
		    <!-- 版本信息 -->
		    <view class="version-info">
		      <text class="current-version">当前版本: v1.0.0</text>
		    </view>
		    
		    <!-- 更新按钮 -->
		    <view class="btn-container" @click="uplodeFn">
		      <button class="update-btn" >检查更新</button>
		    </view>
		  </view>
		<!-- <image class="img" src="@/static/logo.png" mode=""></image> -->
<!-- 				<view class="toplist">
					<view class="topitem">
						<text>版本号：</text>
						<text>{{versi}}</text>
					</view>
				</view>
				<view class="text-arc">
					<view class="box" hover-class="hvbox" >
						检查新版本
					</view>
				</view> -->
		<!-- 更新 -->
		<wrap-version-update ref="updateref" :auto="false" id="706148022059077" @finish="landleFinish"
			@check="landlecheck"></wrap-version-update>
		<!-- 更新 -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				versi: '',
			}
		},
		onShow() {
			setTimeout(()=>{
				this.$refs.updateref.check()
				console.log('更新');
			},300)
		},
		onLoad(option) {

		},
		methods: {
			landlecheck(e) {
				this.versi = e.version
			},
			uplodeFn() {
				this.$refs.updateref.check()
			},
			landleFinish() {
				this.flag = true
				if (this.flag) {
					uni.showToast({
						title: '已经是最新版本'
					})
				}
			},
			
		}
	}
</script>
<style scoped>
/* 页面容器 */
.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 40rpx;
  background-color: #f8f8f8;
  min-height: 100vh;
  box-sizing: border-box;
}

/* Logo区域 */
.logo-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 100rpx;
  margin-bottom: 80rpx;
}

.logo {
  width: 200rpx;
  height: 200rpx;
  border-radius: 40rpx;
  box-shadow: 0 10rpx 20rpx rgba(0, 0, 0, 0.1);
}

.app-name {
  font-size: 36rpx;
  font-weight: bold;
  margin-top: 30rpx;
  color: #333;
}

/* 版本信息 */
.version-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 80rpx;
}

.current-version {
  font-size: 32rpx;
  color: #666;
  margin-bottom: 20rpx;
}

.latest-version {
  font-size: 32rpx;
  color: #07c160;
  font-weight: bold;
}

/* 按钮区域 */
.btn-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 60rpx;
}

.update-btn {
  width: 80%;
  height: 90rpx;
  line-height: 90rpx;
  border-radius: 45rpx;
  font-size: 32rpx;
  color: white;
  background-color: #07c160;
  margin-bottom: 30rpx;
  border: none;
}

.update-btn[disabled] {
  background-color: #cccccc;
  color: #999999;
}

/* 更新日志 */
.update-log {
  width: 90%;
  background-color: white;
  border-radius: 20rpx;
  padding: 30rpx;
  box-shadow: 0 5rpx 15rpx rgba(0, 0, 0, 0.05);
}

.log-title {
  font-size: 32rpx;
  font-weight: bold;
  color: #333;
  display: block;
  margin-bottom: 20rpx;
}

.log-content {
  font-size: 28rpx;
  color: #666;
  line-height: 1.6;
  white-space: pre-line;
}
</style>

<style>
	page {
		background-color: #f8f8f8;
	}
</style>